<%-- 
    Document   : browse
    Created on : 18 déc. 2011, 20:07:30
    Author     : MiniK
--%>

<%@page import="fr.annuaireComp.clientUtils.ProfileModel"%>
<%@page import="fr.annuaireComp.clientUtils.CompetenceModel"%>
<%@page import="fr.DCclient.models.BrowseCompetenceModel"%>
<%@page import="fr.annuaireComp.clientUtils.DomaineModel"%>
<%@page import="fr.annuaireComp.clientUtils.SavoirModel"%>
<%@page import="java.util.ArrayList"%>
<%@page import="java.util.List"%>

<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE html>


<% BrowseCompetenceModel competencesdata = (BrowseCompetenceModel) request.getAttribute("competencesdata");%>
<%
    String savoirEditInpPlaceSelect = "";
    for (SavoirModel s : competencesdata.savoirs) {
        savoirEditInpPlaceSelect += s.libelle + ":" + s.id + ",";
    }

    String domaineEditInpPlaceSelect = "";
    for (DomaineModel d : competencesdata.domaines) {
        domaineEditInpPlaceSelect += d.libelle + ":" + d.id + ",";
    }%>

<%! String competencesMeresEditInPlaceSelect = "";%>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <link rel="stylesheet" href="jquery.treeview.css" />

        <script type="text/javascript" src="jquery-1.7.1.min.js" ></script>
        <script type="text/javascript" src="jquery.treeview.js" ></script>
        <script src="jquery.editinplace.js"></script>
        <script src="jquery.idTabs.min.js" ></script>
        <title>Parcourir les compétences</title>

        <script type="text/javascript" >
            $(document).ready(function(){
                
                $("#create ul").idTabs(); 
      
                $("#comptree").treeview({
                    comptree: "slow"
                });
                
                $("li .competence a").click(function(){
                    displayCompetence($(this).attr("id"));
                });
                
            });
            
            function displayCompetence(compId)
            {
                $.get("browse",{action : "compinfos", id : compId}, function(data){
                    $("#compinfo").replaceWith(data);
                });
            }
      
            var savoirEditInpPlaceSelect = "<%= savoirEditInpPlaceSelect%>";
            var domaineEditInpPlaceSelect = "<%= domaineEditInpPlaceSelect%>";
        </script>
    </head>
    <body>
        <h1>Parcourir les compétences</h1>
        <% if (request.getAttribute("infomsg") != null) {%> 
        <div class="info"> <%= request.getAttribute("infomsg")%></div>
        <% }%>

        <% if (request.getAttribute("errormsg") != null) {%> 
        <div class="error"> <%= request.getAttribute("errormsg")%></div>
        <% }%>


        <table style="width: 100%;">
            <tr>
                <td width: 50%;>
                    <div >
                        <h2>Arbre à compétences</h2>
                        <ul id="comptree">
                            <% for (SavoirModel savoir : competencesdata.savoirs) {%>
                            <li class="closed savoir">
                                <%= savoir.libelle%>

                                <% List<CompetenceModel> compDom = new ArrayList<CompetenceModel>();%>

                                <% for (DomaineModel domaine : competencesdata.domaines) {%>
                                <%
                                    for (CompetenceModel nc : competencesdata.competencesTree) {
                                        if (nc.domaine.id.equals(domaine.id) && nc.savoir.id.equals(savoir.id)) {
                                            compDom.add(nc);
                                        }
                                    }
                                %>
                                <% if (compDom.size() > 0) {%>
                                <ul>
                                    <li class="domaine">
                                        <%= domaine.libelle%> 
                                        <ul>
                                            <%
                                                for (CompetenceModel nc : compDom) {
                                                    printNodes(nc, out);
                                                }
                                                compDom.clear();
                                            %>
                                        </ul>
                                    </li>
                                </ul>
                                <% }%>

                                <% }%>

                            </li>
                            <% }%>

                        </ul>
                    </div>
                </td>
                       <td width: 50%;>
                    <div id="compinfo">

                    </div>
                </td>
            </tr>
        </table>
                            
                            
                            
                            
                            
                            <script type="text/javascript">
                                var competencesMeresEditInPlaceSelect = "<%= competencesMeresEditInPlaceSelect %>";
                         <% competencesMeresEditInPlaceSelect = ""; %>
                            </script>
       

        <div id="create">    
            <ul class="actiontab">
                <li style="display: inline;"><a href="#newcompetence" class="selected">Créer compétence</a></li> 
                <li style="display: inline;">  ¤  </li>
                    
                <li style="display: inline;"><a href="#newsavoir">Créer savoir</a></li> 
                 <li style="display: inline;">  ¤  </li>
                <li style="display: inline;"><a href="#newdomain">Créer domaine</a></li> 
            </ul>
            <div id="newcompetence" style="display: block;" >
                <h2>Ajouter une nouvelle compétence</h2>
                <form method="post">

                    Savoir:   <select name="savoir">
                          <option disabled="true" >Choisir un savoir</option>
                        <% for (SavoirModel s : competencesdata.savoirs) {%>
                        <option value="<%= s.id%>"><%= s.libelle%></option>
                        <% }%>
                    </select>
                    <br/>

                    Domaine de competence:   <select name="domaine">
                        <option disabled="true" >Choisir un domaine</option>
                        <% for (DomaineModel d : competencesdata.domaines) {%>
                        <option value="<%= d.id%>"><%= d.libelle%></option>
                        <% }%>
                    </select>
                    <br/>
                    Libelle <input type="text" name="libelle"/>
                    <br/>

                    Identifiant Compétence Mère: <select name="competencesMere" >
                        <option disabled="true" >Choisir une compétence</option>
                        <%= competenceOptionSelect %>
                        <% competenceOptionSelect = "";%>
			</select>
		
                        
                    </select>  
                    <input type="hidden" name="type" value="competence" />
                    <br/>
                    <input type="submit" value="Créer"/>
                </form>
            </div>

            <div id="newsavoir" style="display: none;" >
                <h2>Ajouter un nouveau savoir</h2>
                <form method="post">
                    Libelle <input type="text" name="libelle"/>
                    <input type="hidden" name="type" value="savoir" />
                    <br/>
                    <input type="submit" value="Créer"/>
                </form>
            </div>

            <div id="newdomain" style="display: none;" >
                <h2>Ajouter un nouveau domaine</h2>
                <form method="post">
                    Libelle <input type="text" name="libelle"/>
                    <input type="hidden" name="type" value="domaine" />
                    <br/>
                    <input type="submit" value="Créer"/>
                </form>
            </div>
                    
    </body>
</html>
</div>

<%!
String competenceOptionSelect = "";
    public void printNodes(CompetenceModel c, JspWriter out) {
        try {

            out.println("<li class=\"competence\">");

            //    out.println(c.id + " : " + c.libelle);
            out.println("<a id=\"" + c.id + "\" href=\"#\">" + c.id + " : " + c.libelle + "</a>");
            competencesMeresEditInPlaceSelect += (c.libelle + ":" + c.id + ",");
            competenceOptionSelect += "<option value=\""+c.id+"\">"+c.libelle+"</option>";
            if (c.competenceFilles.size() > 0) {
                out.println("<ul>");
                for (CompetenceModel nc : c.competenceFilles) {
                    printNodes(nc, out);
                }
                out.println("</ul>");
            }
            out.println("</li>");
        } catch (Exception ex) {
        }
    }

%>